<#assign ctx=request.contextPath />
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>登陆</title>
    <link href="${ctx}/css/login.css" rel="stylesheet">
    <link href="${ctx}/layui/css/modules/layer/default/layer.css" rel="stylesheet">
    <style>
        .login_box{
            background-image: url("${ctx}/imgs/bg3.jpg");
        }
    </style>
</head>

<div class="login_box">
    <header><span>查询平台</span></header>
    <div class="user_input_box">
        <div class="user_input">
            <h3>
                <span class="zhmi_text">账号密码登录</span>
            </h3>
            <div id="d_1">
                <div class="user"><input type="text" id="username" placeholder="请输入账号"/></div>
                <div class="password"><input type="password" id="password" placeholder="请输入密码"/></div>
                <#--<div class="password pd2">-->
                    <#--<input type="text" id="checkCode" style="width: 200px;" placeholder="请输入验证码"/>-->
                    <#--<img src="/getCheckCode" style="width: 120px; border-radius: 5px;"-->
                         <#--onclick="this.src='${ctx}/getCheckCode?'+Math.random()">-->
                <#--</div>-->
                <div class="error" id="error"></div>
                <div class="submit_btn">
                    <button onclick="check()">登录</button>
                </div>
                <div class="register_forgetPassword">
                    <#--<a href="/passFind">忘记密码</a>-->
                    <a href="${ctx}/registerView">注册</a>

                </div>
            </div>
        </div>
    </div>
    <footer>
        <p>Copyright ©2018<a href="#">SANEN</a></p>
    </footer>
</div>
<script src="${ctx}/js/jquery.min.js"></script>
<script src="${ctx}/layui/lay/modules/layer.js"></script>
<script>
    //回车
    $(function () {
        document.onkeydown = function (e) {
            var ev = document.all ? window.event : e;
            if (ev.keyCode == 13) {
                check();
            }
        }
    });


    //账号密码登陆验证
    function check() {
        $("#error").text("");
        var username = $("#username").val().trim();
        if (username == "") {
            $("#error").text("账号名不能为空！");
            return;
        }
        var password = $("#password").val().trim();
        if (password == "") {
            $("#error").text("密码不能为空！");
            return
        }
        $.ajax({
            type: "post",
            url: "${ctx}/loginCheck",
            data: {username: username, password: password, code: 0},
            success: function (data) {
                var status = data.status;
                if (status == 0) {
                    $("#error").text("");
                    //跳转到首页
                    window.location.href = "${ctx}/";
                } else {
                    $("#error").text(data.msg);
                }
            }
        });
    }

    var flag = false;   //是否发送验证码
    //获取验证码
    function getCode() {
        $("#phone_error").text("");
        var cellphone = $("#cellphone").val().trim();
        if (cellphone == "") {
            $("#phone_error").text("手机号不能为空！");
            return;
        } else {
            var re = /^1\d{10}$/;
            if (re.test(cellphone)) {
            } else {
                $("#phone_error").text("手机号格式错误！");
                return;
            }
        }
        //禁用按钮
        $("#codebutton").attr("disabled", "disabled").css("background-color", "#ccc").css("border-color", "#ccc").text("60秒后可再次发送");
        $.ajax({
            type: "post",
            url: "getCode",
            data: {cellphone: cellphone},
            success: function (data) {
                var status = data.status;
                if (status != 0) {
                    //获取验证码错误
                    $("#phone_error").text(data.msg);
                }
                flag = true;
                //60秒可发送一次验证码
                var max = 60;
                var send = setInterval(function () {
                    max--;
                    $("#codebutton").text(max + "秒后可再次发送");
                    if (max <= 0) {
                        $("#codebutton").removeAttr("disabled").css("background-color", "#02b2a2").css("border-color", "#02b2a2").text("获取验证码");
                        clearInterval(send);
                    }
                }, 1000);

            }
        });
    }

    //手机号登陆
    function cellphoneLogin() {
        $("#phone_error").text("");
        if (!flag) {
            $("#phone_error").text("请先获取验证码！");
            return;
        }
        var code = $("#code").val();
        if (code == "") {
            $("#phone_error").text("请输入验证码！");
            return;
        }
        $.ajax({
            type: "post",
            url: "phoneCheck",
            data: {code: code},
            success: function (data) {
                var status = data.status;
                if (status == 0) {
                    $("#phone_error").text("");
                    //跳转到首页
                    window.location.href = "index";
                } else {
                    $("#phone_error").text(data.msg);
                }
            }
        });
    }
</script>
</html>
